import { _decorator, Component, Graphics, Color, UITransform, Vec3, Node, Layers } from 'cc';

const { ccclass } = _decorator;

@ccclass('ExtractPoint')
export class ExtractPoint extends Component {
  onLoad() {
    // Visual flag/triangle
    this.node.layer = Layers.Enum.DEFAULT;
    const ui = this.node.getComponent(UITransform) ?? this.node.addComponent(UITransform);
    if (ui.contentSize.width === 0 || ui.contentSize.height === 0) {
      ui.setContentSize(24, 24);
    }
    const g = this.node.getComponent(Graphics) ?? this.node.addComponent(Graphics);
    g.clear();
    g.fillColor = Color.CYAN;
    g.moveTo(0, 10);
    g.lineTo(0, -10);
    g.lineTo(12, 0);
    g.close();
    g.fill();

    if (typeof console !== 'undefined' && console.debug) {
      const p = this.node.worldPosition;
      console.debug('[EXTRACT] marker ready at', `(${p.x.toFixed(1)},${p.y.toFixed(1)})`);
    }
  }

  static spawnAt(root: Node, pos: Vec3): Node {
    const n = new Node('ExtractPoint');
    root.addChild(n);
    n.setWorldPosition(pos);
    n.addComponent(ExtractPoint);
    if (typeof console !== 'undefined' && console.debug) {
      console.debug('[EXTRACT] spawn at', `(${pos.x.toFixed(1)},${pos.y.toFixed(1)})`);
    }
    return n;
  }
}
